.Del-About-container {
    width: 100%;
    .About-us-explain {
        .center;
        .explain-items;
        padding-bottom: 55px;
        border-bottom: 1px solid #ccc;
    }
    .About-us-work {
        .center;
        .work-explain {
            margin: 55px 0;
            .explain-item {
                float: left;
                width: 30%;
                margin-left: 5%;
                h4 {
                    color: #5f5b5b;
                    font-weight: 600;
                }
                .item {
                    margin-top: 20px;
                    font-size: 16px;
                    color: #8f8f8f;
                }
            }
            .explain-left {
                margin-left: 0;
            }
            .explain-center {}
            .explain-right {}
        }
    }
    .About-us-meet {
        background: #efefef;
        padding-bottom: 55px;
        .meet-explain {
            .center;
            padding: 50px 0;
            .explain-items;
        }
        .meet-work {
            .center;
            .work-item {
                margin: auto -10px;
                height: auto;
                overflow: hidden;
                .item {
                    float: left;
                    width: 317px;
                    padding-bottom: 30px;
                    .item-box {
                        width: 265px;
                        margin: auto 25px;
                        .item-img-box {
                            position: relative;
                            width: 100%;
                            height: 200px;
                            background: #b6b6b6;
                            overflow: hidden;
                            .box-a {
                                position: absolute;
                                left: 0;
                                top: 0;
                                width: 100%;
                                height: 100%;
                                .icon {
                                    position: absolute;
                                    opacity: 0;
                                    filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);
                                    top: 50%;
                                    left: 50%;
                                    height: 40px;
                                    width: 40px;
                                    text-align: center;
                                    margin: -20px 0 0 -20px;
                                    transform: scale(2, 2);
                                    z-index: 20;
                                    transition-duration: 0.2s;
                                    i {
                                        color: #fff;
                                        font-size: 40px;
                                    }
                                }
                                .bgcolor {
                                    position: absolute;
                                    opacity: 0;
                                    filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);
                                    left: 0;
                                    top: 0;
                                    overflow: hidden;
                                    height: 100%;
                                    width: 100%;
                                    background-color: #00c3b6;
                                    z-index: 10;
                                    transition-duration: 0.2s;
                                }
                            }
                            .add {
                                position: absolute;
                                width: 100%;
                                height: 30px;
                                background: seashell;
                                line-height: 30px;
                                bottom: -30px;
                                text-align: center;
                                transition-duration: 0.2s;
                                z-index: 11;
                                .add-a {
                                    width: 30px;
                                    height: 30px;
                                    color: firebrick;
                                    line-height: 30px; 
                                }
                                .add-a:hover {
                                    color: #00c3f4;
                                }
                                .add-left {
                                   float: left;
                                   margin-left: 10px;
                                }
                                .add-right {
                                    float: right;
                                    margin-right: 10px;
                                }
                            }
                        }
                        .title {
                            padding-top: 17px;
                            h4 {
                                color: #5f5b5b;
                                font-weight: 600;
                            }
                            .p-top {
                                font-size: 16px;
                                color: #8f8f8f;
                                padding: 5px 0 12px;
                                border-bottom: 1px solid #ccc;
                            }
                            .p-article {
                                font-size: 16px;
                                padding: 15px 0;
                                color: #8f8f8f;
                            }
                            list-style: none;
                            padding-bottom: 30px;
                            .title-list {
                                .list-item {
                                    margin-right: 10px;
                                    text-align: center;
                                    float: left;
                                    cursor: pointer;
                                    a {
                                        display: inline-block;
                                        width: 34px;
                                        height: 34px;
                                        border-radius: 100%;
                                        background-color: #fff;
                                        font-size: 18px;
                                        color: #666262;
                                        line-height: 37px;
                                    }
                                }
                                .list-rss:hover a {
                                    background-color: #00c3f4;
                                    color: #efefef;
                                }
                                .list-f:hover a {
                                    background-color: #f39c12;
                                    color: #efefef;
                                }
                                .list-twitter:hover a {
                                    background-color: #79ac21;
                                    color: #efefef;
                                }
                            }
                        }
                    }
                }
                .item:hover {
                    .item-box {
                        .item-img-box {
                            a {
                                .icon {
                                    transform: scale(1, 1);
                                    opacity: 0.9;
                                    filter:progid:DXImageTransform.Microsoft.Alpha(opacity=90);
                                }
                                .bgcolor {
                                    opacity: 0.9;
                                    filter:progid:DXImageTransform.Microsoft.Alpha(opacity=80);
                                }
                            }
                            .add {
                                bottom: 0;
                            }
                        }
                    }
                }
            }
        }
    }
    .About-us-needyou {
        .needyou-explain {
            .center;
            .explain-items;
            .explain-button {
                padding: 20px 0 55px;
                input {
                    padding: 14PX 20PX;
                    text-align: center;
                    color: #fff;
                    font-size: 12px;
                    background: #87b672;
                    font-weight: 600;
                    border: 0;
                }
                a:hover input {
                    background: #D58512;
                }
            }
        }
    }
}
@media only screen and (max-width: 1259px) {
    .Del-About-container {
        width: 100%;
        .About-us-explain {
            .mgcenter;
            .explain-items;
            padding-bottom: 55px;
            border-bottom: 1px solid #ccc;
        }
        .About-us-work {
            .mgcenter;
        }
        .About-us-meet {
            .meet-explain {
                .mgcenter;
                padding: 50px 0;
                .explain-items;
            }
            .meet-work {
                width: 940px;
                margin: 0 auto;
            }
        }
        .About-us-needyou {
            .needyou-explain {
                .mgcenter;
                .explain-items;
            }
        }
    }
}
@media only screen and (max-width: 1024px) {
    .Del-About-container {
        width: 100%;
        .About-us-explain {
            .mgcenter;
            .explain-items;
            padding-bottom: 55px;
            border-bottom: 1px solid #ccc;
        }
        .About-us-meet {
            .meet-work {
                width: 620px;
                margin: 0 auto;
            }
        }
    }
}
@media only screen and (max-width: 768px) {
    .Del-About-container {
        width: 100%;
        .About-us-explain {
            .mgcenter;
            .explain-items;
            padding-bottom: 55px;
            border-bottom: 1px solid #ccc;
        }
        .About-us-work {
            .work-explain {
                background-color: #efefef;
                .explain-item {
                    float: none;
                    width: 100%;
                    padding: 25px;
                    text-align: center;
                    margin-left: 0;
                    h4 {
                        padding-bottom: 20px;
                    }
                }
            }
        }
        .About-us-meet {
            .meet-work {
                width: 300px;
                margin: 0 auto;
            }
        }
    }
}